<template>
	<div id="app">
		<hote-header />
		<div class="hote-admin-body">
			<hote-sidebar />
			<div class="hote-admin-room">
				<hote-floor v-for="floor in hoteData" :floorData="floor"/>
			</div>
		</div>
		<hote-status />
	</div>
</template>

<style>
	.hote-admin-room {
		float: left;
		background-color: #fff;
	}
</style>

<script>
	import config  from '../../config';
	import Floor   from './Floor';
	import Header from '../../components/Header';
	import RoomStatus from './RoomStatus';
	import Sidebar from '../../components/Sidebar';

	const statusData = config.status || [];

	export default {
		data() {
			return {
				hoteData: [],
				statusData
			}
		},
		components: {
			'hote-header': Header,
			'hote-floor': Floor,
			'hote-status': RoomStatus,
			'hote-sidebar': Sidebar
		},
		mounted() {
			this
				.$http
				.get('/admin/info')
				.then(res => {
					if (res.data.status) {
						this.hoteData = res.data.list;
					}
				})

		}
	}
</script>